<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"  
                xmlns:h="http://java.sun.com/jsf/html"  
                xmlns:p="http://primefaces.prime.com.tr/ui" 
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:fn="http://java.sun.com/jsp/jstl/functions"
                template="/Facelets/Templates/template.xhtml">  

    <ui:define name="content"> 
        <h:form id="wizard" >
            
            <p:panel>
                <p:wizard widgetVar="wiz" 
                          >

                    <p:tab id="personal" title="confirmar">

                        <p:panel header="Personal Details">

                            <h:messages errorClass="error"/>

                            <h:panelGrid columns="2" columnClasses="label, value" styleClass="grid">
                                <h:outputText value="Firstname: *" />
                                
                                <h:outputText value="Lastname: *" />
                                
                                <h:outputText value="Age: " />
                                
                                <h:outputText value="Skip to last: " />
                            </h:panelGrid>
                        </p:panel>
                    </p:tab>

                    <p:tab id="address" title="endereço">
                        <p:panel header="Adress Details">

                            <h:messages errorClass="error"/>

                            <h:panelGrid columns="2" columnClasses="label, value">
                                <h:outputText value="Street: " />
                            
                                <h:outputText value="Postal Code: " />
                            
                                <h:outputText value="City: " />
                            
                                <h:outputText value="Skip to last: " />
                            </h:panelGrid>
                        </p:panel>
                    </p:tab>

                    <p:tab id="contact" title="contato">
                        <p:panel header="Contact Information">

                            <h:messages errorClass="error"/>

                            <h:panelGrid columns="2" columnClasses="label, value">
                                <h:outputText value="Email: *" />
                            
                                <h:outputText value="Phone: " />
                            
                                <h:outputText value="Additional Info: " />
                            </h:panelGrid>
                        </p:panel>
                    </p:tab>

                    <p:tab id="confirmar" title="Confirmar">
                        <p:panel header="Confirmation">

                            <p:growl id="growl" sticky="true" showDetail="true"/>

                            <h:panelGrid id="confirmation" columns="6">
                                <h:outputText value="Firstname: " />
                            
                                <h:outputText value="Lastname: " />
                                <h:outputText value="Age: " />
                            
                                <h:outputText value="Street: " />
                            
                                <h:outputText value="Postal Code: " />
                            
                                <h:outputText value="City: " />
                            
                                <h:outputText value="Email: " />
                            
                                <h:outputText value="Phone " />
                            
                                <h:outputText value="Info: " />
                            
                                <h:outputText />
                                <h:outputText />
                            </h:panelGrid>

                            <p:commandButton value="Submit" update="growl" />

                        </p:panel>
                    </p:tab>

                </p:wizard>

            </p:panel>

        </h:form>

        <h:form>
            <p:confirmDialog message="Deseja realmente excluir este Usuário?"
                             showEffect="slide" hideEffect="explode" appendToBody="true"
                             header="Confirmação" severity="alert" modal="true"
                             widgetVar="confirmation">

                <p:commandButton value="Sim" update="formTabela"
                                 oncomplete="confirmation.hide()"
                                 />
                <p:commandButton value="Não" onclick="confirmation.hide()"
                                 type="button" />
            </p:confirmDialog>
        </h:form>



    </ui:define> 
</ui:composition>